<template>
	<view>
		<cu-custom bgColor="bg-white" isBack="true">
			<block slot="content">修改头像</block>
		</cu-custom>

		<view class="container">

			<button class="login_a" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				<image :src="avatar_logo"></image>
			</button>
			<!-- 	<view class="imgof" @click="mpWxLogin">
		点击保存
	</view>
	 -->

		</view>
	</view>
</template>

<script>
	import api from '../../common/apiService';
	import request from '../../common/request';
	export default {
		data() {
			return {
				avatar: request.baseUrl + 'img/avatar.png',
				avatar_logo: request.baseUrl + 'img/avatar.png',
			};
		},
		methods: {
			onChooseAvatar(e) {
				const {
					avatarUrl
				} = e.detail;
				let _this = this;
				uni.uploadFile({
					url: request.baseUrl + 'p-icon', // 仅为示例，非真实的接口地址
					filePath: avatarUrl,
					name: 'image',
					success: (res) => {
						// request.baseUrl = 
						let data = JSON.parse(res.data);
						console.log(data);
						setTimeout(() => {
							_this.avatar_logo = request.baseUrl + data.data.uri;
							_this.avatar = request.baseUrl + data.data.uri;
							let paramsList = {
								avatar_logo: _this.avatar //头像
							}
							uni.setStorageSync('imgsrc', paramsList)
							uni.showToast({
								title: '上传成功'
							}).then(() => {
								setTimeout(() => {
									uni.redirectTo({
										url: '/pages/account/account'
									})
								}, 1500)
							})
						}, 1000)
					}
				});
			},
			// mpWxLogin() {
			// 			  let _this=this;
			// 			  let paramsList = {
			// 			  	avatar_logo: this.avatar //头像
			// 			  }
			// 				// console.log(paramsList)
			// 	uni.setStorageSync('imgsrc', paramsList)

			// 	uni.showToast({
			// 		title:'上传成功'
			// 	}).then(()=>{
			// 		setTimeout(()=>{
			// 			uni.redirectTo({
			// 				url:'/pages/account/account'
			// 			})
			// 		}, 1500)
			// 	})
			// 	// console.log("存到本地", imgsrc)

			// 	}
		}
	};
</script>

<style lang="scss" scoped>
	.container {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100vh;
		/* 使容器充满视口高度 */

		.login_a {
			width: 320px;
			/* 设置头像宽度 */
			height: 300px;
			/* 设置头像高度 */
			line-height: 300rpx;
			border-radius: 50%;
			/* 圆形头像 */
			// margin-bottom: 20px; /* 头像与按钮间距 */

			image {
				width: 100%;
				height: 100%;
			}
		}

		.imgof {
			padding: 10px 20px;
			background-color: #007aff;
			/* 按钮背景色 */
			color: white;
			/* 按钮文字颜色 */
			border-radius: 5px;
			/* 按钮圆角 */
			text-align: center;
			margin: 5px 0;
			/* 按钮间距 */
		}
	}
</style>